<template>
    <div>
        <el-row>
            <el-col :span="24">
                <el-select v-model="form.roleId" multiple placeholder="请选择" style="width: 80%">
                    <el-option
                            v-for="item in options"
                            :key="item.roleId"
                            :label="item.roleName"
                            :value="item.roleId">
                    </el-option>
                </el-select>
            </el-col>
        </el-row>
    </div>
</template>

<script>
    import {getRole}from '@/api/roleApi'
    import {getUserRole,inserUserRole}from '@/api/userAPI'
    export default {
        props: {
            params: {
                type: Object,
                default () {
                    return {}
                }
            }
        },
        data() {
            return {
                options: [],
                form:{
                    account:'',
                    roleId:[]
                }
            }
        },
        methods:{
            submit(){
                return new Promise((resolve, reject) => {
                    inserUserRole(this.form).then(res => {
                        resolve(res.data)
                    }).catch(e => {
                        reject(e)
                        this.$message.error({
                            message: '抱歉，操作遇到异常，请重试或联系管理员处理'
                        })
                    })
                })
            }
        },
        created() {
            this.form.account=this.params.account
            getUserRole({account:this.params.account}).then(res=>{
                this.form.roleId=res.data.data
            }).catch(e => {
                this.$message.error({
                    message: '抱歉，读取角色信息信息遇到异常，请重试或联系管理员处理'
                })
            })
            getRole(this.searchForm).then(res=>{
                this.options=res.data.data
            }).catch(e => {
                this.$message.error({
                    message: '抱歉，读取角色信息信息遇到异常，请重试或联系管理员处理'
                })
            })
        }
    }
</script>

<style scoped>

</style>
